/*base*/
body,html,div,p,table,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6{margin:0px;padding:0px;}
ul,ol,li,dl,dt,dd{list-style:none;}
img,a{border:none;}
em,i{font-style:normal;}
a{outline:none;text-decoration:none;-webkit-tap-highlight-color:rgba(255,0,0,0);}
a:active{background:rgba(1,148,225,0.2);}
body{font-family:"微软雅黑",Arial,Helvetica;font-weight:normal;text-shadow:none;background:#121737;width:100%;height:100%;position:relative;margin:0px;padding:0px;}
.clear{width:0px;height:0px;font-size:0px;line-height:0px;clear:both;overflow:hidden;}

/*页面框架*/
#web_wrap{
	-webkit-transform-origin:top;
	transform-origin:top;
	width:320px;
	margin:0px auto;
	position:relative;
	/*-webkit-transition:0.3s;
	-ms-transition:0.3s;
	-moz-transition:0.3s;
	transition:0.3s;
	right:0px;*/
}

/*页面内容*/
.container{width:320px;margin:0px auto;position:relative;}

.musicBtn1{display:inline-block;width:24px;height:24px;background:url(../images/music.png) 0px 0px no-repeat;background-size:24px auto;position:fixed;right:10px;top:10px;z-index:99;opacity:1;}
.musicBtn2{display:inline-block;width:24px;height:24px;background:url(../images/music2.png) 0px 0px no-repeat;background-size:24px auto;position:fixed;right:10px;top:10px;z-index:98;opacity:0;}
.musicBtn1:active{background:url(../images/music.png) 0px 0px no-repeat;background-size:24px auto;}
.musicBtn2:active{background:url(../images/music2.png) 0px 0px no-repeat;background-size:24px auto;}

.indexbg_box{width:320px;padding-top:350px;padding-bottom:20px;min-height:100px;background:#121737 url(../images/index_bg.jpg) center top no-repeat;background-size:320px auto;position:relative;}
.bg_box{width:320px;padding-top:270px;padding-bottom:20px;min-height:100px;background:#121737 url(../images/bg01.jpg) center top no-repeat;background-size:320px auto;position:relative;}
.bg_box .rule{display:block;width:67px;height:20px;background:#fff;border:1px solid #37bc9b;border-radius:5px;text-align:center;padding:4px 0px 1px 0px;font-size:14px;color:#37bc9b;float:right;margin-top:20px;margin-right:10px;}
.bg_box .rule:active{background:#1cfcc4;}


.score_box{width:254px;height:124px;background:url(../images/score.png) 0px 0px no-repeat;background-size:252px auto;position:absolute;left:35px;top:50px;text-align:center;}
.score_box img{display:inline-block;width:40px;border-radius:50%;border:2px solid #f4b01e;position:relative;margin-top:-50px;}
.score_box h4{color:#fff;font-size:15px;text-shadow:1px 1px 3px #111;font-weight:normal;letter-spacing:1px;}
.score_box p{color:#fff;font-size:12px;text-shadow:1px 1px 2px #757575;font-weight:normal;text-align:left;padding-left:10px;margin-top:8px;}
.chest_text{margin-top:10px;width:100%;}
.chest_text i{display:block;width:40px;height:40px;background:url(../images/icon.png) -454px 0px no-repeat;background-size:500px auto;float:left;}
.chest_text p{float:left;width:190px;margin-left:5px;margin-top:2px;color:#772a00;text-shadow:none;}


.indexbg_box .game_start{display:block;width:208px;height:70px;background:url(../images/icon.png) -94px -80px no-repeat;background-size:500px auto;text-indent:-9999px;position:absolute;left:100px;top:265px;}
.indexbg_box .game_start:active{opacity:0.8;}


.game_user{position:relative;width:320px;height:60px;padding-top:40px;text-align:center;}
.game_user_box{width:88px;height:35px;text-align:center;background:url(../images/icon.png) 0px -212px no-repeat;background-size:500px auto;display:inline-block;position:relative;}
.game_user_box p{width:100%;text-align:center;font-size:12px;color:#ac0000;border-radius:10px;padding:1px 0px;position:absolute;margin-top:-4px;-webkit-transform:scale(0.8);font-weight:bold;}
.game_user_box img{display:inline-block;width:40px;border-radius:50%;border:2px solid #fff;position:relative;margin-top:-50px;}


.bg_box .cheak_score{display:block;width:248px;height:80px;text-align:center;line-height:80px;text-indent:-9999px;background:url(../images/icon.png) -94px -340px no-repeat;background-size:500px auto;margin:0px auto;}
.bg_box .cheak_score:active{opacity:0.8;}


.invite_friend{text-align:center;width:320px;margin:10px auto 20px auto;}
.invite_friend h6{color:#ffc320;font-weight:normal;width:320px;display:inline-block;-webkit-transform:scale(0.8);white-space:nowrap;}
.invite_friend .friend_btn{display:inline-block;width:248px;height:80px;text-align:center;line-height:80px;text-indent:-9999px;background:url(../images/icon.png) 0px -420px no-repeat;background-size:500px auto;}
.invite_friend .friend_btn:active{opacity:0.8;}

.playagain_btn{display:inline-block;color:#fff;}
.playagain_btn i{display:inline-block;width:18px;height:13px;background:url(../images/icon.png) -33px -166px no-repeat;background-size:500px auto;margin-right:3px;}



.score_text{width:320px;text-align:center;color:#fff;font-size:14px;margin:10px 0px;}
.score_text p b{color:#ff9600;}
.over_event{padding:5px;border:2px solid #ffa800;width:80%;margin:10px auto;}


.playtoo_btn{width:320px;text-align:center;}
.playtoo_btn a{display:inline-block;width:145px;height:64px;text-indent:-9999px;}
.playtoo_btn a:active{opacity:0.8;}
.playtoo_btn a:nth-of-type(1){background:url(../images/icon.png) -355px -285px no-repeat;background-size:500px auto;}
.playtoo_btn a:nth-of-type(2){background:url(../images/icon.png) -355px -350px no-repeat;background-size:500px auto;}


.menu_btn{text-align:center;margin:10px auto;}
.menu_btn a{display:inline-block;width:86px;height:90px;margin:0px 5px;text-indent:-9999px;}
.menu_btn a:active{opacity:0.8;}
.menu_btn a:nth-of-type(1){background:url(../images/icon.png) -216px -168px no-repeat;background-size:500px auto;}
.menu_btn a:nth-of-type(2){background:url(../images/icon.png) -316px -168px no-repeat;background-size:500px auto;}
.menu_btn a:nth-of-type(3){background:url(../images/icon.png) -416px -168px no-repeat;background-size:500px auto;}

.indexbg_box .menu_btn a:nth-of-type(3){background:url(../images/icon.png) -98px -168px no-repeat;background-size:500px auto;}


.prize_setting{width:290px;min-height:80px;background:#2a2f4b;border:1px solid #2a2f4b;border-radius:10px;position:relative;margin:0px auto;top:40px;margin-bottom:40px;padding-top:30px;padding-bottom:20px;}
.prize_title{width:165px;height:53px;line-height:24px;background:url(../images/icon.png) 0px 0px no-repeat;background-size:500px auto;font-size:18px;color:#fff;text-align:center;position:absolute;left:65px;top:-30px;text-indent:-9999px;}

.prize_setting p{width:250px;padding:0px 10px;font-size:12px;color:#fff;line-height:18px;position:relative;margin-left:20px;margin-top:8px;}
.prize_setting p i{display:inline-block;width:17px;height:15px;background:url(../images/icon.png) 0px -166px no-repeat;background-size:500px auto;position:absolute;margin-left:-20px;top:3px;margin-right:5px;}



.ranking{width:288px;min-height:300px;background:#2a2f4b;border:1px solid #2a2f4b;border-radius:10px;position:relative;padding-bottom:20px;margin:0px auto;top:50px;}
.more_ranking{display:block;margin:5px auto;padding:5px 10px;border:2px solid #ff7800;width:120px;text-align:center;height:30px;line-height:30px;color:#ff9600;border-radius:5px;margin-top:66px;}
.ranking_winners{border:1px solid #ffd52b;}
.ranking_title{width:165px;height:53px;line-height:24px;background:url(../images/icon.png) -182px 0px no-repeat;background-size:500px auto;font-size:18px;color:#fff;text-align:center;position:absolute;left:65px;top:-30px;text-indent:-9999px;}
.winners{background:url(../images/icon.png) -232px 0px no-repeat;background-size:500px auto;}
.ranking h4{font-size:12px;color:#fff;width:100%;text-align:center;position:absolute;top:30px;letter-spacing:1px;font-weight:normal;}
.ranking h4 em{color:#ffa800;}


.nameline{width:270px;margin:0px auto;margin-top:10px;}
.nameline .num1{width:22px;height:27px;background:url(../images/icon.png) 0px -67px no-repeat;background-size:500px auto;font-size:12px;color:#fff;text-align:center;line-height:32px;float:left;margin-top:8px;}
.nameline .num2{width:22px;height:27px;background:url(../images/icon.png) 0px -104px no-repeat;background-size:500px auto;font-size:12px;color:#a3a2a2;text-align:center;line-height:32px;float:left;margin-top:8px;}
.nameline .num3{width:22px;height:27px;background:url(../images/icon.png) 0px -67px no-repeat;background-size:500px auto;font-size:12px;color:#fff;text-align:center;line-height:32px;float:left;margin-top:8px;}
.nameline .num{width:20px;height:20px;font-size:12px;color:#fff;text-align:center;line-height:20px;float:left;margin-top:10px;border:1px solid #e4aa4e;border-radius:50%;}
.nameline img{float:left;width:41px;border-radius:50%;margin-left:10px;}
.nameline .name{float:left;color:#fff;font-size:14px;line-height:41px;margin-left:15px;}
.nameline .km{float:right;color:#fff;font-size:14px;line-height:41px;margin-right:5px;}


.rule_backhome{display:block;width:90px;height:30px;border:1px solid #ffc600;border-radius:8px;text-align:center;line-height:30px;margin:20px auto 10px auto;color:#ff7800;position:absolute;right:10px;top:-10px;background:#443a8d;color:#fff;font-size:12px;}

.rule_con{width:320px;min-height:500px;background:#f3f3f3;position:relative;top:20px;margin-top:-20px;padding:18px 0px;}
.rule_con h4{font-size:18px;color:#ff9600;text-align:center;}
.rule_con h4 i{display:inline-block;width:28px;height:28px;background:url(../images/icon.png) 0px -280px no-repeat;background-size:500px auto;margin-right:5px;position:relative;top:5px;}
.rule_con p{width:90%;display:block;margin:0px auto;font-size:12px;line-height:22px;margin-top:10px;color:#444444;}
.rule_con span{width:90%;display:block;margin:0px auto;font-size:12px;line-height:22px;color:#444444;}
.rule_con p b{color:#ff9600;}

.rule_con img{width:90%;display:block;margin:5px auto;}
.rule_con a{display:block;width:150px;height:40px;border:2px solid #ff7800;border-radius:8px;text-align:center;line-height:40px;margin:20px auto 10px auto;color:#ff7800;}


.ranking_con{width:320px;min-height:500px;background:#f3f3f3;position:relative;top:20px;margin-top:-20px;padding:18px 0px;}
.ranking_con h4{font-size:18px;color:#ff9600;text-align:center;margin-bottom:20px;}
.ranking_con h4 i{display:inline-block;width:35px;height:35px;background:url(../images/icon.png) 0px -325px no-repeat;background-size:500px auto;margin-right:5px;position:relative;top:8px;}
.ranking_con .nameline{color:#444444;padding:0px 25px;}
.ranking_con .nameline:nth-child(odd){background:#e2e4e5;padding:8px 25px;}
.ranking_con .name{color:#444444;}
.ranking_con .km{color:#444444;}
.ranking_con .num{color:#444444;}
.ranking_con .backToHome{display:block;width:150px;height:40px;border:2px solid #ff7800;border-radius:8px;text-align:center;line-height:40px;margin:20px auto 10px auto;color:#ff7800;}


.prize_con{width:320px;min-height:500px;background:#f3f3f3;position:relative;top:20px;margin-top:-20px;padding:18px 0px;}
.prize_con h4{font-size:18px;color:#ff9600;text-align:center;margin-bottom:20px;}
.prize_con h4 i{display:inline-block;width:40px;height:40px;background:url(../images/icon.png) -454px 0px no-repeat;background-size:500px auto;margin-right:5px;position:relative;top:12px;}
.prize_con h5{font-size:16px;color:#444444;}
.prize_con h6{font-size:12px;color:#ff7800;}
.prize_text p{font-size:14px;margin:5px 0px;color:#444444;line-height:20px;}
.prize_text p b{color:#ff7800;}

.prize_text{width:290px;margin:0px auto 30px auto;}
.prize_text .getPrize{font-size:14px;margin:5px 0px;color:#444444;line-height:22px;}

.prize_text .prizeInput{margin:10px 0px;}
.prize_text .prizeInput span{display:inline-block;width:100px;font-size:14px;}
.prize_text .prizeInput input{display:inline-block;width:180px;height:25px;line-height:25px;font-size:14px;border:1px solid #dddddd;}
.prize_text .prizeInput .subBtn{width:90px;height:35px;background:#ff7800;border-radius:5px;color:#fff;border:none;outline:none;margin:0px auto;display:block;margin-top:15px;}
.prize_text .prizeInput .subBtn:active{background:#fc9a42;}


.prize_con a{display:block;width:150px;height:40px;border:2px solid #ff7800;border-radius:8px;text-align:center;line-height:40px;margin:20px auto 10px auto;color:#ff7800;}


.share_box{width:175px;height:156px;background:url(../images/sharebg.png) 0px 0px no-repeat;background-size:175px auto;position:fixed;left:130px;top:10px;z-index:10;display:none;}
.share_box p{color:#fff;width:90%;position:absolute;top:80px;font-size:12px;left:8px;line-height:18px;}
.share_box p b{color:#ffea00;font-weight:normal;}
.share_box_lay{width:100%;height:100%;background:rgba(0,0,0,0.7);position:absolute;left:0px;top:0px;z-index:9;display:none;}



/*游戏*/
.gamebg_box{width:320px;min-height:506px;background:#121328 url(../images/game_bg.jpg) 0px 0px no-repeat;background-size:320px auto;position:relative;overflow:hidden;}
.gamebg_box .count{width:70px;height:25px;position:absolute;left:48px;top:15px;}
.gamebg_box .count p{font-size:12px;color:#fff;line-height:25px;}
.gamebg_box .count p b{font-size:14px;color:#ffca00;}
.gamebg_box .score{width:70px;height:25px;position:absolute;left:182px;top:15px;font-size:12px;}
.gamebg_box .score p{font-size:12px;color:#fff;line-height:25px;}
.gamebg_box .score p b{font-size:14px;color:#ffca00;}

.chest_box{width:40px;height:40px;background:url(../images/icon.png) -454px 0px no-repeat;background-size:500px auto;position:fixed;left:140px;top:150px;display:none;-webkit-animation:cheastAni 1s .2s ease both;}
@-webkit-keyframes cheastAni{
	0%{-webkit-transform:scale(1);}
	50%{-webkit-transform:scale(2)}
	100%{-webkit-transform:scale(1)}
}


.go_btn{display:block;width:100px;height:100px;background:url(../images/go.png) 0px 0px no-repeat;background-size:100px auto;position:fixed;left:110px;top:100px;z-index:50;}
.container .go_btn:active{background:url(../images/go.png) 0px 0px no-repeat;background-size:100px auto;opacity:0.7;}
.go_btn_wrap{width:100%;height:100%;position:fixed;left:0px;top:0px;background:rgba(0,0,0,0.7);z-index:49;}

.pao_box{position:fixed;bottom:150px;left:0px;z-index:48;}
.pao_wrap{width:92px;height:100px;position:absolute;left:120px;top:-15px;}
.pao{width:63px;height:80px;background:url(../images/pao.png) 0px 0px no-repeat;background-size:63px auto;position:absolute;left:15px;top:10px;z-index:2;}
.pao1{width:92px;height:100px;background:url(../images/pao1.png) 0px 0px no-repeat;background-size:92px auto;position:absolute;left:5px;top:-50px;z-index:1;opacity:0;transition:0.3s;}
.ant{width:248px;height:114px;background:url(../images/ant.png) 0px 0px no-repeat;background-size:248px auto;position:absolute;left:30px;top:10px;z-index:3;}

.gamebg_box li { position:absolute; top:-100px;  background:url(../images/1.png) no-repeat 0 0;  text-align:center; color:#fff; font:bold 1em/20px "Arial"; z-index:10; transition:6s;-webkit-transition:6s;-moz-transition:6s;-ms-transition:6s;}
.gamebg_box li.li01 { background-image:url(../images/1.png) ; background-size:61px auto;}
.gamebg_box li.li02 { background-image:url(../images/2.png) ; background-size:37px auto;}
.gamebg_box li.li03 { background-image:url(../images/3.png) ; background-size:32px auto;}
.gamebg_box li.li04 { background-image:url(../images/4.png) ; background-size:33px auto;}
.gamebg_box li.li05 { background-image:url(../images/5.png) ; background-size:42px auto;}
.gamebg_box li span { display:none;  position:absolute; width:70px; height:36px; background:url(../images/candy.png) no-repeat center center; background-size:70px auto;  left:-10px;top:5px;}

@-webkit-keyframes 'fontChange' {
  0% {opacity:1;}
  50% {opacity:0.5;}
  100% {opacity:0;}
}
@-moz-keyframes 'fontChange' {
  0% {opacity:1;}
  50% {opacity:0.5;}
  100% {opacity:0;}
}
@-ms-keyframes 'fontChange' {
  0% {opacity:1;}
  50% {opacity:0.5;}
  100% {opacity:0;}
}
@keyframes 'fontChange' {
  0% {opacity:1;}
  50% {opacity:0.5;}
  100% {opacity:0;}
}
.gamebg_box li.active { 
	-webkit-animation-name: 'fontChange';
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-moz-animation-name: 'fontChange';
	-moz-animation-duration: 1s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: 1;
	-ms-animation-name: 'fontChange';
	-ms-animation-duration: 1s;
	-ms-animation-timing-function: ease-in-out;
	-ms-animation-iteration-count: 1;
	animation-name: 'fontChange';
	animation-duration: 1s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: 1;
	opacity:0;
}

@-webkit-keyframes 'dis' {
  0% {opacity:100;}
  50% {opacity:50;}
  100% {opacity:0;}
}
@-moz-keyframes 'dis' {
  0% {opacity:100;}
  50% {opacity:50;}
  100% {opacity:0;}
}
@-ms-keyframes 'dis' {
  0% {opacity:100;}
  50% {opacity:50;}
  100% {opacity:0;}
}
@keyframes 'dis' {
  0% {opacity:100;}
  50% {opacity:50;}
  100% {opacity:0;}
}
.gamebg_box li.disImg { 
	-webkit-animation-name: 'dis';
	-webkit-animation-duration: 2s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-moz-animation-name: 'dis';
	-moz-animation-duration: 2s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: 1;
	-ms-animation-name: 'dis';
	-ms-animation-duration: 2s;
	-ms-animation-timing-function: ease-in-out;
	-ms-animation-iteration-count: 1;
	animation-name: 'dis';
	animation-duration: 2s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: 1;
	opacity:0;
	display:none;
}

